<template>
  <div style="height: calc(100% - 44px)">
    <div v-if="auditType.auditType!=='match'" class="resizable-layout">
      <div class="left-pane" :style="{ width: leftWidth }">
        <template v-if="!$slots.left">
          <div style="height: 100%;overflow-y: scroll" class="leftWrapper">
            <template v-if="auditType.auditType==='add'">
              <MainDisplay ref="mainDisplay"></MainDisplay>
            </template>
            <template v-else-if="auditType.auditType==='edit'">
              <ContentDiff ref="contentDiff"/>
            </template>
          </div>
        </template>
        <slot name="left"></slot>
      </div>
      <div class="right-pane" v-if="providedShowAuditTool">
        <template v-if="!$slots.right">
          <div style="height: 100%">
            <CheckContent @update="handleCheckContent" :getField="getDisplayData.bind(this)"></CheckContent>
          </div>
        </template>
        <slot name="right"></slot>
      </div>
    </div>
    <div v-else class="resizable-layout">
      <div class="left-pane match" :style="{ 'width': leftWidth }">
          <div class="left-pane-child-left">
            <InfoPreview :fields-list="fieldsListMap[businessType]">
              <template v-slot:header>
                <div style="height: 42px; background: #ECF5FF;padding: 10px; color:#409EFF;text-align: left;box-sizing: border-box;border-bottom: 1px solid #f0f0f0">
                  申请数据
                </div>
              </template>
            </InfoPreview>
          </div>
          <div class="left-pane-child-right">
            <DataMatch ref="dataMatch"></DataMatch>
          </div>
      </div>
      <div class="right-pane" v-if="providedShowAuditTool">
        <AuditInfo :audit-type="auditType.auditType" ref="auditInfo"/>
      </div>
    </div>

  </div>
</template>

<script lang="ts">
import {Vue, Component, Prop, Inject, Watch} from 'vue-property-decorator';
import MainDisplay from "../MainDisplay/MainDisplay.vue";
import CheckContent from "../MainDisplay/CheckContent.vue";
import ContentDiff from "../ContentDiff/ContentDiff.vue"
import {auditType, ModalContentProps} from "./types";
import InfoPreview from "../MainDisplay/InfoPreview.vue";
import DataMatch from "../DataMatch/DataMatch.vue";
import AuditInfo from "../MainDisplay/AuditInfo.vue";
import {AuditRequestFields, BusinessType} from "../../type";
import {
  BrandDetail,
  CommodityDetail,
  CommodityReviewItem,
  PartnerLicenseDetail,
  SimilarityItem
} from "../../plugins/dto";
import {fieldProps} from "../MainDisplay/InfoPreview";
@Component({
  name: 'ModalContent',
  components: {AuditInfo, DataMatch, InfoPreview, MainDisplay, CheckContent, ContentDiff}
})
export default class ModalContent extends Vue{
  @Inject("showAuditTool")
  providedShowAuditTool!:Boolean

  leftWidth: string = this.providedShowAuditTool ? "80%" : "100%"; // 初始化左区域宽度
  private $message: any;
  private dragging: boolean = false;
  @Inject("businessType")
  businessType!:BusinessType
  checkContentData:AuditRequestFields = <any>{}
  fieldsListMap = {
    "commodity": [
      {
        name: "标签图",
        key: "tagPicture",
        value: "",
        render: "image",
        editable: false,
        labelKey: "",
        multiple: false
      },
      // {
      //   name: "标准商品编码",
      //   key: "standardCode",
      //   value: "",
      //   render: "",
      //   editable: false,
      //   labelKey: "",
      //   multiple: false,
      // },
      {
        name: "商品名称",
        key: "cnName",
        value: "",
        render: "",
        editable: true,
        labelKey: "",
        multiple: false
      },
      {
        name: "规格型号",
        key: "specification",
        value: "",
        editable: true,
        labelKey: "",
        render: "",
        multiple: false
      },
      {
        name: "品牌",
        key: "brandId",
        value: "",
        editable: true,
        render: "BrandSelect",
        labelKey: "brandName",
        multiple: false
      },
      {
        name: "基本单位",
        key: "minSaleUnit",
        value: "",
        editable: true,
        render: "UnitSelect",
        labelKey: "minSaleUnitName",
        multiple: false
      },
      {
        name: "包装参数",
        key: "packageParam",
        value: "",
        editable: true,
        labelKey: "",
        render: "",
        multiple: false
      },
      {
        name: "证照编号",
        key: "licenses",
        value: "",
        editable: true,
        labelKey: "licenseCode",
        render: "LicenseSelect",
        multiple: true
      },
      {
        "key": "managementCategory",
        "name": "管理类别",
        "value": "",
        "editable": false,
        "render": "ManageCategory",
        "multiple": false,
        "labelKey": "managementCategoryName",
      },
      {
        name: "货号",
        key: "articleNo",
        value: "",
        editable: false,
        labelKey: "",
        render: "",
        multiple: false
      },
      {
        name: "商品类型",
        key: "commodityTypeName",
        value: "",
        editable: false,
        labelKey: "",
        render: "",
        multiple: false
      },
      {
        name: "商品分类",
        key: "commodityClass",
        value: "",
        editable: false,
        labelKey: "",
        render: "CommodityClass",
        multiple: false
      },
      {
        name: "物理形态",
        key: "physicalForm",
        value: "",
        editable: false,
        labelKey: "",
        render: "",
        multiple: false
      }
    ],
    "brand": [
      {
        name: "品牌图片",
        key: "logo",
        value: "",
        editable: false,
        render: "image",
        labelKey: "",
        multiple: false
      },
      {
        name: "品牌产品图",
        key: "commodityPicture",
        value: "",
        editable: false,
        render: "image",
        labelKey: "",
        multiple: false
      },
      {
        name: "品牌名称",
        key: "cnName",
        value: "",
        editable: false,
        render: "",
        labelKey: "",
        multiple: false
      },
      {
        name: "英文名称",
        key: "enName",
        value: "",
        editable: false,
        render: "",
        labelKey: "",
        multiple: false
      },
      {
        name: "品牌所属公司",
        key: "companyName",
        value: "",
        editable: false,
        render: "",
        labelKey: "",
        multiple: false
      }
    ],
    "registration": [
      {
        name: "证照编号",
        key: "licenseCode",
        value: "",
        editable: false,
        render: "",
        labelKey: "",
        multiple: false
      },
      {
        name: "证照类型",
        key: "licenseTypeName",
        value: "",
        editable: false,
        render: "",
        labelKey: "",
        multiple: false
      },
      {
        name: "批准日期",
        key: "effDate",
        value: "",
        editable: false,
        render: "",
        labelKey: "",
        multiple: false
      },
      {
        name: "审批部门",
        key: "approvalDepartment",
        value: "",
        editable: false,
        render: "",
        labelKey: "",
        multiple: false
      },
      {
        name: "有效期至",
        key: "periodValidity",
        value: "",
        editable: false,
        render: "",
        labelKey: "",
        multiple: false
      },
      {
        name: "注册人名称",
        key: "commodityCode",
        value: "",
        editable: false,
        render: "",
        labelKey: "",
        multiple: false
      },
      {
        "key": "managementCategory",
        "name": "管理类别",
        "value": "",
        "editable": false,
        "render": "ManageCategory",
        "multiple": false,
        "labelKey": "managementCategoryName",
      },
      {
        name: "注册人住所",
        key: "agent_address",
        value: "",
        editable: false,
        render: "",
        labelKey: "",
        multiple: false
      },
      {
        name: "产品名称",
        key: "commodityCode",
        value: "",
        editable: false,
        render: "",
        labelKey: "",
        multiple: false
      },
      {
        name: "规格型号",
        key: "specification",
        value: "",
        editable: false,
        render: "",
        labelKey: "",
        multiple: false
      },
      {
        name: "规格及组成",
        key: "commodityCode",
        value: "",
        editable: false,
        render: "",
        labelKey: "",
        multiple: false
      },
      {
        name: "使用范围",
        key: "commodityCode",
        value: "",
        editable: false,
        render: "",
        labelKey: "",
        multiple: false
      },
      {
        name: "变更情况",
        key: "changes",
        value: "",
        editable: false,
        render: "",
        labelKey: "",
        multiple: false
      },
      {
        name: "其他内容",
        key: "other_contents",
        value: "",
        editable: false,
        render: "",
        labelKey: "",
        multiple: false
      },
      {
        name: "生产地址",
        key: "productionAddress",
        value: "",
        editable: false,
        render: "",
        labelKey: "",
        multiple: false
      },
      {
        name: "代理人名称",
        key: "agent_name",
        value: "",
        editable: false,
        render: "",
        labelKey: "",
        multiple: false
      },
      {
        name: "代理人住所",
        key: "agent_address",
        value: "",
        editable: false,
        render: "",
        labelKey: "",
        multiple: false
      },
      {
        name: "备注",
        key: "comment",
        value: "",
        editable: false,
        render: "",
        labelKey: "",
        multiple: false
      },
    ],
    partnerLicense: [
      {
        "key": "licenseCode",
        "name": "许可证号",
        "value": "",
        "editable": false,
        "render": "",
        "labelKey": "",
        "multiple": false
      },
      {
        "key": "companyName",
        "name": "单位名称",
        "value": "",
        "editable": false,
        "render": "",
        "labelKey": "",
        "multiple": false
      },
      {
        "key": "warehouseAddress",
        "name": "注册地址",
        "value": "",
        "editable": false,
        "render": "",
        "labelKey": "",
        "multiple": false
      },
      {
        "key": "disinfectionLicenseName",
        "name": "许可证名称",
        "value": "",
        "editable": false,
        "render": "",
        "labelKey": "",
        "multiple": false
      },
      {
        "key": "businessPremises",
        "name": "生产地址",
        "value": "",
        "editable": false,
        "render": "",
        "labelKey": "",
        "multiple": false
      },

      {
        "key": "legalPerson",
        "name": "法定代表人",
        "value": "",
        "editable": false,
        "render": "",
        "labelKey": "",
        "multiple": false
      },
      {
        "key": "administrativeDivision",
        "name": "行政区划",
        "value": "",
        "editable": false,
        "render": "",
        "labelKey": "",
        "multiple": false
      },
      {
        "key": "licenseHandleDate",
        "name": "办理日期",
        "value": "",
        "editable": false,
        "render": "",
        "labelKey": "",
        "multiple": false
      },
      {
        "key": "businessDateStart",
        "name": "开始日期",
        "value": "",
        "editable": false,
        "render": "",
        "labelKey": "",
        "multiple": false
      },
      {
        "key": "validityPeriod",
        "name": "截止日期",
        "value": "",
        "editable": false,
        "render": "",
        "labelKey": "",
        "multiple": false
      },
      {
        "key": "specificationInAnnex",
        "name": "附件中规格",
        "value": "",
        "editable": false,
        "render": "",
        "labelKey": "",
        "multiple": false
      }
    ],
    commodityLicense: [
      {
        "key": "licenseCode",
        "name": "注册证编号",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "licenseTypeName",
        "name": "证照类型",
        "value": "",
        "editable": false,
        "render": "",
        "labelKey": "",
        "multiple": false,
      },
      {
        "key": "managementCategory",
        "name": "管理类别",
        "value": "",
        "editable": false,
        "render": "ManageCategory",
        "multiple": false,
        "labelKey": "managementCategoryName",
      },
      {
        "key": "licenseName",
        "name": "注册人名称",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "licenseAddress",
        "name": "注册人住所",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "productionAddress",
        "name": "生产地址",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "productName",
        "name": "产品名称",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "approvalDate",
        "name": "批准日期",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "effDate",
        "name": "生效日期",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "periodValidity",
        "name": "有效期至",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "specification",
        "name": "型号规格",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "productDescription",
        "name": "结构及组成",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "expectPurpose",
        "name": "适用范围",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "storageConditions",
        "name": "储存条件",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "annex",
        "name": "附件",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "otherContents",
        "name": "其他内容",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "comment",
        "name": "备注",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "approvalDepartment",
        "name": "审批部门",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },

      {
        "key": "changes",
        "name": "变更情况",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "specificationInAnnex",
        "name": "附件中规格",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      }
    ],
    foreignLicense: [
      {
        "key": "licenseCode",
        "name": "注册证编号",
        "value": "",
        "editable": false,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "licenseTypeName",
        "name": "证照类型",
        "value": "",
        "editable": false,
        "render": "",
        "labelKey": "",
        "multiple": false,
      },
      {
        "key": "managementCategory",
        "name": "管理类别",
        "value": "",
        "editable": false,
        "render": "ManageCategory",
        "multiple": false,
        "labelKey": "managementCategoryName",
      },
      {
        "key": "licenseName",
        "name": "注册人名称",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "licenseAddress",
        "name": "注册人住所",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "productionAddress",
        "name": "生产地址",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "agentName",
        "name": "代理人名称",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "agentAddress",
        "name": "代理人住所",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "productName",
        "name": "产品名称",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "approvalDate",
        "name": "批准日期",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "effDate",
        "name": "生效日期",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "periodValidity",
        "name": "有效期至",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "specification",
        "name": "型号规格",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "productDescription",
        "name": "结构及组成",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "expectPurpose",
        "name": "适用范围",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "storageConditions",
        "name": "储存条件",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "annex",
        "name": "附件",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "otherContents",
        "name": "其他内容",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "comment",
        "name": "备注",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "approvalDepartment",
        "name": "审批部门",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },

      {
        "key": "changes",
        "name": "变更情况",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "specificationInAnnex",
        "name": "附件中规格",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      }
    ],
    domesticRecord: [
      {
        "key": "licenseCode",
        "name": "备案号",
        "value": "",
        "editable": false,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "licenseTypeName",
        "name": "证照类型",
        "value": "",
        "editable": false,
        "render": "",
        "labelKey": "",
        "multiple": false
      },
      {
        "key": "managementCategory",
        "name": "管理类别",
        "value": "",
        "editable": false,
        "render": "ManageCategory",
        "multiple": false,
        "labelKey": "managementCategoryName",
      },
      {
        "key": "licenseName",
        "name": "备案人名称",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "licenseAddress",
        "name": "备案人住所",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "productionAddress",
        "name": "生产地址",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "productName",
        "name": "产品名称",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "approvalDate",
        "name": "备案日期",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "specification",
        "name": "型号规格",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "productDescription",
        "name": "产品描述",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "expectPurpose",
        "name": "预期用途",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "storageConditions",
        "name": "储存条件",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "comment",
        "name": "备注",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "approvalDepartment",
        "name": "备案单位",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },

      {
        "key": "changes",
        "name": "变更情况",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "specificationInAnnex",
        "name": "附件中规格",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      }
    ],
    foreignRecord: [
      {
        "key": "licenseCode",
        "name": "备案号",
        "value": "",
        "editable": false,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "licenseTypeName",
        "name": "证照类型",
        "value": "",
        "editable": false,
        "render": "",
        "labelKey": "",
        "multiple": false
      },
      {
        "key": "managementCategory",
        "name": "管理类别",
        "value": "",
        "editable": false,
        "render": "ManageCategory",
        "multiple": false,
        "labelKey": "managementCategoryName",
      },
      {
        "key": "licenseName",
        "name": "备案人名称",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "licenseAddress",
        "name": "备案人住所",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "productionAddress",
        "name": "生产地址",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "agentName",
        "name": "代理人名称",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "agentAddress",
        "name": "代理人住所",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "productName",
        "name": "产品名称",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "approvalDate",
        "name": "备案日期",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "specification",
        "name": "型号规格",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "productDescription",
        "name": "产品描述",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "expectPurpose",
        "name": "预期用途",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "storageConditions",
        "name": "储存条件",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "comment",
        "name": "备注",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "approvalDepartment",
        "name": "备案单位",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },

      {
        "key": "changes",
        "name": "变更情况",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      },
      {
        "key": "specificationInAnnex",
        "name": "附件中规格",
        "value": "",
        "editable": true,
        "render": "",
        "multiple": false,
        labelKey: "",
      }
    ]
  }
  @Inject("auditType")
  auditType!:{auditType:string}
  handleCheckContent(data:{type: BusinessType, data:any}){
    this.checkContentData = data.data
  }
  beforeDestroy(){
    (this.$refs["contentDiff"] as any).$destroy();
  }
  mounted(){
  }

  @Inject("businessType")
  providedBusinessType!:BusinessType

  startDragging(event: MouseEvent) {
    this.dragging = true;
    document.addEventListener('mousemove', this.onDragging);
    document.addEventListener('mouseup', this.stopDragging);
  }

  @Inject("CommodityDetail")
  providedCommodityDetail!:CommodityDetail;


  @Inject("BrandDetail")
  providedBrandDetail!:BrandDetail


  @Inject("CommodityLicenseDetail")
  providedCommodityLicenseDetail!:BrandDetail


  @Inject("PartnerLicenseDetail")
  providedPartnerLicenseDetail!:PartnerLicenseDetail

  @Watch("auditType", {immediate: true, deep: true})
  changeValue(){
    if(this.auditType.auditType === 'match'){
      this.leftWidth = this.providedShowAuditTool ? "82%" : '100%';
      // 设置所有字段不可编辑
      this.fieldsListMap["commodity"].forEach((item)=>{
        item.editable = false
      })
      this.fieldsListMap["commodityLicense"].forEach((item)=>{
        item.editable = false
      })
      this.fieldsListMap["brand"].forEach((item)=>{
        item.editable = false
      })
    }
  }

  @Watch("providedBrandDetail", {immediate: true, deep: true})
  brandDetailChange(){
    this.fieldsListMap[this.providedBusinessType.businessType] = this.fieldsListMap[this.providedBusinessType.businessType].map(item => {
      item.value = this.providedBrandDetail[item.key as keyof typeof this.providedBrandDetail] as string;
      return item
    })
  }


  @Watch("providedCommodityLicenseDetail", {immediate: true, deep: true})
  commodityLicenseDetailChange(){

    this.fieldsListMap[this.providedBusinessType.businessType] = this.fieldsListMap[this.providedBusinessType.businessType].map(item => {
      item.value = this.providedCommodityLicenseDetail[item.key as keyof typeof this.providedCommodityLicenseDetail] as string;
      return item
    })
  }

  @Watch("providedPartnerLicenseDetail", {immediate: true, deep: true})
  partnerLicenseDetailChange(){
    this.fieldsListMap[this.providedBusinessType.businessType] = this.fieldsListMap[this.providedBusinessType.businessType].map(item => {
      item.value = this.providedPartnerLicenseDetail[item.key as keyof typeof this.providedPartnerLicenseDetail] as string;
      return item
    })
  }

  @Watch("providedCommodityDetail", {immediate: true, deep: true})
  commodityDetailChange(){
    this.fieldsListMap[this.providedBusinessType.businessType] = this.fieldsListMap[this.providedBusinessType.businessType].map(item => {
      item.value = <string>this.providedCommodityDetail[item.key as keyof CommodityDetail];
      if(item.labelKey && !item.multiple){
        //@ts-ignore
        item[item.labelKey as keyof fieldProps] = this.providedCommodityDetail[item.labelKey as keyof typeof this.providedCommodityDetail];
      }else if(item.labelKey &&　item.multiple){
        //@ts-ignore
        item[item.key as keyof fieldProps] = this.providedCommodityDetail[item.key as keyof typeof this.providedCommodityDetail]
      }
      return item
    })
  }


  created(){

  }
  getDisplayData(){
    if(this.businessType.businessType === "commodity"){
      if(this.auditType.auditType === 'add'){
        //@ts-ignore
        return (this.$refs["mainDisplay"] as InstanceType<typeof MainDisplay>)?.["commodityReviewData"]
      }else if(this.auditType.auditType === 'edit'){
        return (this.$refs["contentDiff"] as any)["commodityReviewData"]
      }
    }else if (this.businessType.businessType === "brand"){
      if(this.auditType.auditType === 'add'){
        return (this.$refs["mainDisplay"] as any)["brandReviewData"]
      }else if(this.auditType.auditType === 'edit'){
        return (this.$refs["contentDiff"] as any)["brandReviewData"]
      }
    }else if(["commodityLicense", "foreignLicense" , "domesticRecord" , "foreignRecord"].includes(this.businessType.businessType)){
      if(this.auditType.auditType === 'add'){
        return (this.$refs["mainDisplay"] as any)["commodityLicenseReviewData"]
      }else if(this.auditType.auditType === 'edit'){
        return (this.$refs["contentDiff"] as any)["commodityLicenseReviewData"]
      }

    }else if(this.businessType.businessType === 'partnerLicense'){
      if(this.auditType.auditType === 'add'){
        return (this.$refs["mainDisplay"] as any)["partnerLicenseReviewData"]
      }else if(this.auditType.auditType === 'edit'){
        return (this.$refs["contentDiff"] as any)["partnerLicenseReviewData"]
      }
    }
  }
  getMatchData(key:string){
    const selectedRow:SimilarityItem = (this.$refs["dataMatch"] as any)["selectedRow"]
    const mdResult:number | undefined = (this.$refs["auditInfo"] as any)["mdResult"]
    const updateFields:string[] = (this.$refs["auditInfo"] as any)["matchResult"]
    const remark:string|undefined = (this.$refs["auditInfo"] as any)["auditContent"]
    //@ts-ignore
    if((mdResult === 2 || mdResult === 3) && Object.keys(selectedRow).length === 0){
      this.$message.warning("请选择一条主数据")
      return
    }
    const updateMdField:{[key:string]:any} = {}
    updateFields.forEach((k)=>{
      //@ts-ignore
      updateMdField[k] = this[key][k as keyof typeof this[key]] as string
    })
    return {
      mdResult, updateMdField, remark:remark, commodityId: selectedRow["id"], brandId: selectedRow["id"], licenseId: selectedRow["id"]
    }
  }
  onDragging(event: MouseEvent) {
    if (this.dragging) {
      const newWidth = (event.clientX / window.innerWidth) * 100;
      if (newWidth >= 70) {
        this.leftWidth = `${newWidth}%`;
      }
    }
  }

  stopDragging() {
    this.dragging = false;
    document.removeEventListener('mousemove', this.onDragging);
    document.removeEventListener('mouseup', this.stopDragging);
  }
}
</script>

<style scoped>
.resizable-layout {
  display: flex;
  height: calc(100%);
}

.left-pane {
  height: 100%;



  min-width: 70%; /* 设置最小宽度 */
  border-right: 1px solid #f0f0f0;
}

.left-pane.match{
  display: flex;
  .left-pane-child-left{
    border-right: 1px solid #f0f0f0;
    min-width: 20%;
    height: 100%;
  }
}
.left-pane-child-right{
  flex:1;
  overflow-x: scroll
}
.left-pane-child-right::-webkit-scrollbar{
  display: none;
}
.divider {
  width: 10px;
  cursor: col-resize;
}
.left-pane-child-right div:nth-child(1) {
  height: 100%;
}

.right-pane {
  flex-grow: 1;
  height: calc(100%);
  padding: 5px;
  box-sizing: border-box;
}
.right-pane div:nth-child(1) {
  height: 100%
}
.leftWrapper::-webkit-scrollbar {
  width: 6px;
}
.leftWrapper::-webkit-scrollbar-track{
  background: #fff;
}
.leftWrapper::-webkit-scrollbar-thumb{
  background: #C0C4CC;
  border-radius: 3px;
}
</style>
